<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>博客</title>
    <link rel='stylesheet' href='/stylesheets/header.css' />
    <link rel='stylesheet' href='/stylesheets/footer.css' />
    <link rel='stylesheet' href='/stylesheets/blog.css' />
    <link rel='stylesheet' href='/stylesheets/page.css' />
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>
</head>
<body ng-app="myApp">
<% include header.html %>
<section class="blog">
    <ul>
        <% articles.forEach(function(article){ %>
        <li>
            <div class="title"><%=article.title %></div>
            <div class="describe"><span style="color: #5196a8">简介：</span><%=article.describe %></div>
            <div class="bottom">
                <span class="createTime">创建时间：<%=article.creatTime %></span>
                <span class="updateTime">更新时间：<%=article.updateTime %></span>
                <span class="full_text"><a href="/full?article=<%=article._id %>">阅读全文</a></span>
            </div>
        </li>
        <% }) %>
    </ul>
</section>
<div id="pagination">
</div>
<div>
    <i class="fa fa-top"></i>
</div>
<div class="blog"></div>
<script type="text/javascript" src="/javascripts/angular.min.js"></script>
<script type="text/javascript" src="/javascripts/myApp.js"></script>
<script type="text/javascript" src="/javascripts/header.js"></script>
<script src="/javascripts/jquery.js"></script>
<script src="/javascripts/jqPaginator.js"></script>
<script>
    $(function () {
        var totalPages1 = '<%= totalPages %>';
        var totalPages = parseInt(totalPages1);
        var currentPage1 = '<%= page %>';
        var currentPage = parseInt(currentPage1);

        function cur(first) {
            if (currentPage == 1) {
                if (first == "first") {
                    return '<li class="first"><a href="javascript:void(0);">首页</a></li>';
                } else {
                    return '<li class="prev"><a href="javascript:void(0);">«</a></li>';
                }

            } else {
                if (first == "first") {
                    return '<li class="first"><a href="/blog?page=1">首页</a></li>';
                } else {
                    return '<li class="prev"><a href="/blog?page=' + (currentPage - 1) + '">«</a></li>';
                }
            }
        }

        function last(last) {
            if (currentPage == totalPages) {
                if (last == "last") {
                    return '<li class="last"><a href="javascript:void(0);">尾页</a></li>';
                } else {
                    return '<li class="next"><a href="javascript:void(0);">»</a></li>';
                }
            } else {
                if (last == "last") {
                    return '<li class="last"><a href="/blog?page=' + totalPages + '">尾页</a></li>'
                } else {
                    return '<li class="next"><a href="/blog?page=' + (currentPage + 1) + '">»</a></li>';
                }
            }
        }

        $.jqPaginator('#pagination', {
            totalPages: totalPages,
            visiblePages: 5,
            currentPage: currentPage,
            wrapper: '<ul class="pagination"></ul>',
            first: cur('first'),
            prev: cur('prev'),
            next: last('next'),
            last: last('last'),
            page: '<li class="page"><a href="/blog?page={{page}}">{{page}}</a></li>',
            onPageChange: function (num) {
            }
        });
    });
</script>
</body>
</html>